import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";
import path from "path";
// element-plus 按需引入
import AutoImport from "unplugin-auto-import/vite";
import Components from "unplugin-vue-components/vite";
import { ElementPlusResolver } from "unplugin-vue-components/resolvers";
// WindiCSS
import WindiCSS from "vite-plugin-windicss";

// https://vite.dev/config/
export default defineConfig({
  plugins: [
    vue(),
    // element-plus 按需引入
    AutoImport({
      resolvers: [ElementPlusResolver()],
    }),
    Components({
      resolvers: [
        ElementPlusResolver({
          importStyle: "sass", // 如果使用自定义主题，需要设置为 'sass'
          directives: true, // 是否自动导入指令
        }),
      ],
      // 组件自动导入的目录
      dirs: ["src/components"],
    }),
    // WindiCSS
    WindiCSS(),
  ],
  resolve: {
    alias: {
      "@": path.resolve(__dirname, "src"),
      /* 样式类路径 */
      "@assets": path.resolve(__dirname, "src/assets"), // 静态资源目录
      "@styles": path.resolve(__dirname, "src/styles/global.scss"), // 样式目录
      "@layout": path.resolve(__dirname, "src/layout"), // 布局目录
      /* 组件类路径 */
      "@views": path.resolve(__dirname, "src/views"), // 页面目录
      "@components": path.resolve(__dirname, "src/components"), // 组件目录
      "@store": path.resolve(__dirname, "src/store"), // 状态管理
      "@api": path.resolve(__dirname, "src/api"), // 接口目录
      "@router": path.resolve(__dirname, "src/router"), // 路由目录
      /* 配置类路径 */
      "@config": path.resolve(__dirname, "src/config"), // 配置目录
      "@types": path.resolve(__dirname, "src/types"), // 类型目录
      "@constants": path.resolve(__dirname, "src/constants"), // 常量目录
      /* 封装类路径 */
      "@utils": path.resolve(__dirname, "src/utils"), // 工具目录
      "@plugins": path.resolve(__dirname, "src/plugins"), // 插件目录
      "@directives": path.resolve(__dirname, "src/directives"), // 指令目录
      "@hooks": path.resolve(__dirname, "src/hooks"), // Hooks目录
    },
  },
  css: {
    preprocessorOptions: {
      scss: {
        additionalData: `@use "@/styles/element/index.scss" as *;`,
      },
    },
  },
});
